<template>
	<view class="num " style="height: 100vh;margin-top: 40rpx;">
		<block v-if="typeShow==1">
			<view class="bgwhite w94 radius20">
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						手机号
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="请输入手机号"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" border="none"
							v-model="moblie" type="number">
						</u--input>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						验证码
					</view>
					<view class="" style="width: 70%;">
						<view class="input_box_check mt-20 relative">
							<!-- #ifndef APP-NVUE -->
							<u-input placeholder="请输入验证码"
								prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx" border="none"
								v-model="checkNum" type="number">
							<!-- #endif -->
								<!-- #ifdef APP-NVUE -->
								<u--input placeholder="请输入验证码"
									prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx"
									border="none" v-model="checkNum" type="number">
								<!-- #endif -->
									<template slot="suffix">
										<!-- <u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取哈哈哈"></u-code> -->
										<view @click="getCode"
											style="font-size: 24rpx; border: 2rpx solid #89BA20;color: #89BA20;height: 40rpx;padding: 0 20rpx;line-height: 1.5;border-radius: 30rpx;">
											获取验证码</view>
										<!-- class="check_btn" @tap="getCode" -->
									</template>
							<!-- #ifndef APP-NVUE -->
							</u-input>
							<!-- #endif -->
							<!-- #ifdef APP-NVUE -->
							</u--input>
							<!-- #endif -->
						</view>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						新密码
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="请设置新密码"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" password type="number" maxlength="6" border="none"
							v-model="passwordone">
						</u--input>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						确认新密码
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="再次输入新密码"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" password type="number" maxlength="6" border="none"
							v-model="passwordtwo">
						</u--input>
					</view>
				</view>

			</view>
			<view class="flex" style="justify-content: center;">
				<view class=""
					style="width: 80%;height: 90rpx;border-radius: 90rpx;background-color: #CEEE5B;text-align: center;line-height: 2.5;margin-top: 40rpx;"
					@click="submit">
					完成
				</view>
			</view>
		</block>
		<block v-if="typeShow==2">
			<view class="bgwhite w94 radius20">
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						手机号
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="请输入手机号"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" border="none"
							v-model="value.checkNum" type="number">
						</u--input>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						验证码
					</view>
					<view class="" style="width: 70%;">
						<view class="input_box_check mt-20 relative">
							<!-- #ifndef APP-NVUE -->
							<u-input placeholder="请输入验证码"
								prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx" border="none"
								v-model="value.checkNum">
							<!-- #endif -->
								<!-- #ifdef APP-NVUE -->
								<u--input placeholder="请输入验证码"
									prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx"
									border="none" v-model="value.checkNum">
								<!-- #endif -->
									<template slot="suffix">
										<!-- <u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取哈哈哈"></u-code> -->
										<view
											style="font-size: 24rpx; border: 2rpx solid #89BA20;color: #89BA20;height: 40rpx;padding: 0 20rpx;line-height: 1.5;border-radius: 30rpx;">
											获取验证码</view>
										<!-- class="check_btn" @tap="getCode" -->
									</template>
							<!-- #ifndef APP-NVUE -->
							</u-input>
							<!-- #endif -->
							<!-- #ifdef APP-NVUE -->
							</u--input>
							<!-- #endif -->
						</view>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						新密码
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="请设置新密码"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" border="none"
							v-model="value.checkNum">
						</u--input>
					</view>
				</view>
				<view class="mt-20 flex-between p-30">
					<view class="" style="line-height:2；margin-right: 20rpx;">
						确认新密码
					</view>
					<view class="" style="width: 50%;">
						<u--input placeholder="再次输入新密码"
							prefixIconStyle="font-size: 22px;color: #909399;width:30rpx;height:30rpx;" border="none"
							v-model="value.checkNum">
						</u--input>
					</view>
				</view>

			</view>
			<view class="flex" style="justify-content: center;">
				<view class=""
					style="width: 80%;height: 90rpx;border-radius: 90rpx;background-color: #CEEE5B;text-align: center;line-height: 2.5;margin-top: 40rpx;"
					@click="submit">
					完成
				</view>
			</view>
		</block>

	</view>
</template>

<script>
	import {
		setPassword,
		send
	} from '@/common/teacherReq';
	export default {
		data() {
			return {
				typeShow: 1,
				moblie: '',
				checkNum: '',
				passwordone: '',
				passwordtwo: ''
			};
		},
		onLoad(opt) {
			this.typeShow = Number(opt.type)
			if (this.typeShow == 1) {
				uni.setNavigationBarTitle({
					title: '设置支付密码'
				})
			} else {
				uni.setNavigationBarTitle({
					title: '设置登陆密码'
				})
			}
		},
		methods: {
			submit() {
				// this.successPeo = true
				console.log("submit")
				setPassword({
					mobile: this.moblie,
					captcha: this.checkNum,
					password: this.passwordone,
					passwordtwo: this.passwordtwo

				}).then(res=>{
					uni.showToast({
						icon: 'success',
						title: '修改成功',
						success() {
							uni.switchTab({
								url: '/pages/user/index'
							})
						}
					});
				})
			},
			getCode(){
				if (this.moblie.length !== 11) {
					uni.showToast({
						icon: 'none',
						title: '手机号长度应为11位'
					});
					return;
				}
				send({
					mobile: this.moblie,
					group_id: 3
				}).then(res => {
					uni.showToast({
						icon: 'success',
						title: '发送成功'
					});
				})
			},
			successComSubmit() {
				// this.successCom = true
			}
		}
	}
</script>

<style lang="scss" scoped>
	.nameauth {
		.input_box_check {
			padding: 24rpx;
			// background-color: #d8d8d8;
			border-radius: 100rpx;
			height: 76rpx;
			line-height: 76rpx;
			font-size: 24rpx;
		}

		.input_box_text {
			padding: 16rpx;
		}

		.input_box_check {
			padding: 0 24rpx;

			.check_btn {
				position: absolute;
				// right: 30rpx;
				// top: 10rpx;
				font-size: 27rpx;
				color: #444444;
			}
		}
	}
</style>